<template>
	<gracePage :customHeader="false">
		<!-- 页面主体 -->
		<view slot="gBody" class="grace-body">
			<view class="my_money_view">
			  <image src="../../static/money.png" alt="">
			  <text>¥{{userInfoData.recharge?userInfoData.recharge:"0.00"}}</text>
			  <text @tap="goMyMoneyRecharge" class="recharge">现金充值</text>
			  <text @tap="goMyCardRecharge" class="recharge">礼品卡充值</text>
			</view>
		</view>
	</gracePage>
</template>
<script>
import gracePage from '../../graceUI/components/gracePage.vue';
export default {
	data() {
		return {
			userInfoData:{}
		};
	},
	onLoad() {
		this.getData()
	},
	methods: {
		getData: function () {
			this.gRequest.get('/login/getmemberinfo', {
				member_id:JSON.parse(uni.getStorageSync("userInfo")).member_id
			}, res => {
				this.setData({ userInfoData: res.data });
			});
		},
		goMyMoneyRecharge:function(){
			uni.navigateTo({
				url: '../myMoney/MyMoneyRecharge'
			});
		},
		goMyCardRecharge:function(){
			uni.navigateTo({
				url: '../myMoney/MyCardRecharge'
			});
		}
	},
	components: {
		gracePage
	}
};
</script>
<style>
page {
	background: #f9f9f9;
}
</style>
<style lang="scss">
  .my_money_view {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    margin-top: 8vw;
  }
  .my_money_view>image {
    width: 12vw;
    height: 12vw;
  }
  .my_money_view>text:nth-of-type(1) {
    color: #333333;
    font-weight: 600;
    font-size: 8vw;
    margin-top: 4vw;
  }
  .my_money_view .recharge {
    width: 80vw;
    height: 12vw;
    text-align: center;
    line-height: 12vw;
    background-color: #EB5D4B;
    border-radius: 2vw;
    color: #FFFFFF;
    margin-top: 4vw;
  }
</style>
